<template id="setTeacher">
  <a-modal
    :visible="visible"
    title="学生导师设置"
    :width="700"
    :confirmLoading="confirmLoading"
    @cancel="() => { $emit('close') }"
    @ok="save"
  >

      <a-form :form="form">
        <a-row>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">学号：</a-col>
            <a-col :md="15" offset="1">{{info.xh}}</a-col>
          </a-col>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">姓名：</a-col>
            <a-col :md="15" offset="1">{{info.xm}}</a-col>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">院系：</a-col>
            <a-col :md="15" offset="1">{{info.xjxx && info.xjxx.ssyxmc}}</a-col>
          </a-col>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">专业：</a-col>
            <a-col :md="15" offset="1">{{info.xjxx && info.xjxx.sszymc}}</a-col>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">性别：</a-col>
            <a-col :md="15" offset="1">{{info.xbmc}}</a-col>
          </a-col>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">年级：</a-col>
            <a-col :md="15" offset="1">{{info.xjxx && info.xjxx.sznjmc}}</a-col>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">导师姓名：</a-col>
            <a-col :md="15" offset="1">{{info.xjxx && info.xjxx.dsxm}}</a-col>
          </a-col>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">身份证：</a-col>
            <a-col :md="15" offset="1">{{info.zjhm}}</a-col>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">学年：</a-col>
            <a-col :md="15" offset="1">{{info.sznj}}</a-col>
          </a-col>
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">学期：</a-col>
            <a-col :md="15" offset="1">{{info.dqxqmc}}</a-col>
          </a-col>
        </a-row>
         <a-row>
          <!-- <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">培养方向：</a-col>
            <a-col :md="15" offset="1">{{info.pyfx}}</a-col>
          </a-col> -->
          <a-col :md="12" :sm="24" class="item">
            <a-col :md="7" offset="1" style="text-align:right">学生类别</a-col>
            <a-col :md="15" offset="1">{{info.xjxx && info.xjxx.xslbmc}}</a-col>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24">
            <a-form-item
              label="导师"
              :labelCol="{span: 7,offset: 1}"
              :wrapperCol="{span: 15, offset: 1}"
            >
              <a-select
                showSearch
                :filterOption="filterOption"
                optionFilterProp="children"
                :allowClear="true"
                v-decorator="[
              'firstTutor',
              {
                rules: [{ required: true, message: '请选择导师!' }],
              }
            ]">
                <a-select-option v-for="i in teacherList" :key="i.id" :value="i.dsbh">
                  {{ i.dsbh+" "+i.xm }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="12" :sm="24">
            <a-form-item
              label="第二导师"
              :labelCol="{span: 7,offset: 1}"
              :wrapperCol="{span: 15, offset: 1}"
            >
              <a-select
                showSearch
                :filterOption="filterOption"
                :allowClear="true"
                v-decorator="[
                  'secondTutor'
                ]">
                <a-select-option v-for="i in teacherList" :key="i.id" :value="i.dsbh">{{ i.dsbh+" "+i.xm }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="24">
            <a-form-item
              label="研究方向"
              :labelCol="{span: 7,offset: 1}"
              :wrapperCol="{span: 15, offset: 1}"
            >
              <a-select
                showSearch
                :filterOption="filterOption"
                :allowClear="true"
                v-decorator="['researchDirection']">
                <a-select-option v-for="i in researchDirection" :key="i.id" :value="i.yjfxm">{{ i.yjfxmc }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>

  </a-modal>
</template>
<script>
export default {
  props: ['visible', 'info'],
  data () {
    return {
      confirmLoading: false,
      teacherList: [],
      researchDirection: []
    }
  },
  watch: {
    'info': function (newVal, oldVal) {
      if (newVal) {
        this.form.resetFields()
        this.form.setFieldsValue({
          firstTutor: this.info.dszgh,
          secondTutor: this.info.dedszgh,
          researchDirection: this.info.xjxx.yjfx
        })
        this.$api.student.tutorByStu({xh: this.info.xh, yxm: this.info.xjxx.ssyxm, zym: this.info.xjxx.sszym
            ,xslbm: this.info.xjxx.xslbm}).then(res => {
          this.teacherList = res.data
        })
        this.$api.base.researchListByStu({xh: this.info.xh}).then(res => {
          this.researchDirection = res.data
        })
      }
    }
  },
  beforeCreate () {
    this.form = this.$form.createForm(this)
  },
  methods: {
    // search () {
    //   const xh = this.form.getFieldValue('xh')
    //   this.$api.student.xsxxinfo(xh).then(res => {
    //     this.info = res.data
    //   })
    // },
    selectDs (value, option) {
      this.form.setFieldsValue({firstTutor: option.data.attrs.name})
    },
    selectDds (value, option) {
      this.form.setFieldsValue({secondTutor: option.data.attrs.name})
    },
    selectYjfx (value, option) {
      this.form.setFieldsValue({researchDirection: option.data.attrs.name})
    },
    save () {
      this.form.validateFields((err, values) => {
        if (err) {
          return
        }
        let param = Object.assign(values, {xh: this.info.xh})
        this.$api.student.addTutor(param).then(res => {
          this.$message.success('操作成功')
          this.$emit('close')
          this.$emit('refresh')
        })
      })
    },
    filterOption (input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    }
  }
}
</script>
<style lang="less">
  .card-area {
    .item {
      line-height: 40px;
      height: 40px;
    }
    #setTeacher {
      .ant-form-item-label {
        text-align: left;
      }
    }
  }
</style>
